<template name="workstatistics">
	<view>
		<scroll-view :scroll-y="modalName==null" class="page" :class="modalName!=null?'show':''">
			<cu-custom bgColor="bg-gradual-pink" :isBack="true">
				<block slot="content">人员工作统计</block>
			</cu-custom>
			<view class="disflexconent">
				<view class="title">{{titleTime}}数据统计</view>
			</view>
			<view class="labelnum padding">点击→可按对应进行排序。点击数字可查看清单。其中【待遇审】、【预审通过】、【预审不通过】不受事件筛选条件影响。</view>
			<view class="disflex">
				<view class="searchtip">
					<uni-search-bar placeholder="搜索人员名称" @confirm="search" v-model="dangerDesc">
					</uni-search-bar>
				</view>
				<view class="span">
					<analysisdrawer :type="typelei" ref="mainindex" @testShow="getlist"></analysisdrawer>
				</view>

			</view>
			<view class="list">
				<view class="h-table">
					<view class="h-tr h-tr-3 h-thead">
						<view class="h-td">姓名</view>
						<view class="h-td">完成排查</view>
						<view class="h-td">复查场所</view>
						<view class="h-td">新增隐患</view>
						<view class="h-td">整改隐患</view>
						<view class="h-td">待预审</view>
						<view class="h-td">预审通过</view>
						<view class="h-td">预审不通过</view>
						<view class="h-td">新增场所</view>
					</view>
					<!-- <view class="h-tr h-tr-3" v-if="index < 1" v-for="(item,index) in formDataList" :key="index + '1'">
						<view class="h-td"></view>
						<view class="h-td">{{item.text}}</view>
						<view class="h-td">{{item.dangerNum}}</view>
						<view class="h-td">{{item.noRectifyNum}}</view>
						<view class="h-td">{{item.rectifyNum}}</view>
					</view> -->
					<view class="h-tr h-tr-3" v-for="(item,index) in formDataList" :key="index">
						<view class="h-td">{{item.userName}}</view>
						<!-- <view class="h-td" @click="compCheck(item.userId,'1','changsuo')">{{item.finishCheckNum}}</view>
						<view class="h-td" @click="compCheck(item.userId,'2','changsuo')">{{item.reviewPlaceNum}}</view> -->
						<view class="h-td">{{item.finishCheckNum}}</view>
						<view class="h-td">{{item.reviewPlaceNum}}</view>
						<view class="h-td" @click="compCheck(item.userId,'0','')">{{item.addDangerNum}}</view>
						<view class="h-td" @click="compCheck(item.userId,'1','')">{{item.rectifyDangerNum}}</view>
						<view class="h-td" @click="compCheck(item.userId,'2','')">{{item.pendReviewNum}}</view>
						<view class="h-td" @click="compCheck(item.userId,'3','')">{{item.passReviewNum}}</view>
						<view class="h-td" @click="compCheck(item.userId,'4','')">{{item.noPassReviewNum}}</view>
						<view class="h-td" @click="compCheck(item.userId,'0','changsuo')">{{item.noPassReviewNum}}
						</view>
					</view>
				</view>
			</view>
			<!-- 隐患管理弹框 -->
			<uni-popup ref="bottompopup" type="bottom" :mask-click="true">
				<view class="scortop">
					<view class="title">隐患管理</view>
					<uni-icons type="close" size="30" @click="compclose"></uni-icons>
				</view>
				<view class="scrollbox">
					<view class="box">
						<view class="formbox">
							<view class="disflex">
								<view class="searchtip">
									<uni-search-bar placeholder="请输入隐患描述" @confirm="search" v-model="dangerDesc">
									</uni-search-bar>
								</view>
								<view class="span">
									<analysisdrawer :type="typeleitwo" ref="mainindextwo" @testShowTwo="getlistTwo">
									</analysisdrawer>
								</view>
							</view>
							<scroll-view @scrolltolower="lowerBottom" @refresherrefresh="getFresh" scroll-y="true"
								class="scrollHeight">
								<view class="shequcontent">
									<view class="listdetail">
										<view class="li animation-slide-bottom"
											:style="[{animationDelay: (index + 1)*0.05 + 's'}]"
											v-for="(item,index) in dangerList" @click="gotoDanger(item.dangerId)">
											<view class="listtop margin-bottom">
												<span>{{item.placeName}}</span>
												<span>{{item.checkTime}}</span>
											</view>

											<text class="planame margin-bottom">{{item.dangerDesc}}</text>
											<!-- <view class="imglist margin-bottom" v-for="(items,i) in 4" :key="i">
												<image src="" mode="aspectFill"></image>
											</view> -->
											<view class="middle_img">
												<view class="Colt_center_middleImg" v-for="(items,i) in item.photoList"
													:key="i">
													<view class="img_wapBox">
														<image class="imag" :src="items.url" mode="aspectFill"
															@click.stop="photoPreview(item.photoList,i)"></image>
													</view>
												</view>
											</view>
											<view class="label margin-bottom">{{item.address}}{{item.placeCode}}</view>
											<view class="label margin-bottom">{{item.address}}</view>
											<view class="listbottom">
												<view class="zheng" @click.stop="getdetail(item.placeId)">查看场所</view>
												<view class="jibie" @click.stop="gotoDanger(item.dangerId)">
													{{item.status == 0 ? '未整改' : '已整改'}}
												</view>
												<view class="jibie" @click.stop="gotoDanger(item.dangerId)"
													v-if="item.reviewStatus != null">{{item.reviewStatus}}</view>
											</view>

										</view>
									</view>
									<view class="loadingType">{{loadingType == true ?'没有更多数据了!' : '上拉显示更多'}}</view>
								</view>
							</scroll-view>

						</view>
					</view>

				</view>
			</uni-popup>

			<!-- 场所管理弹框 -->
			<uni-popup ref="changsuopopup" type="bottom" :mask-click="true">
				<view class="scortop">
					<view class="title">场所管理</view>
					<uni-icons type="close" size="30" @click="compcloseTwo"></uni-icons>
				</view>
				<view class="scrollbox">
					<view class="box">
						<view class="formbox">
							<view class="disflex">
								<view class="searchtip">
									<uni-search-bar placeholder="请输入场所描述" @confirm="search" v-model="dangerDesc">
									</uni-search-bar>
								</view>

								<view class="span">
									<analysisdrawer :type="typeleiChansuo" ref="mainindexChansuo"
										@testShowChansuo="getlistChansuo">
									</analysisdrawer>
								</view>
							</view>
							<view class="totalspan">总数：{{chansuoTotal}}家</view>
							<scroll-view @scrolltolower="lowerBottomTwo" @refresherrefresh="getFresh" scroll-y="true"
								class="scrollHeight">
								<view class="shequcontent">
									<view class="uslist">
										<view class="li animation-slide-bottom"
											:style="[{animationDelay: (index + 1)*0.05 + 's'}]"
											v-for="(item,index) in dangerList" @click="getdetail(item.placeId)"
											:key="index">
											<view class="left">
												<view class="h6">{{item.placeName}}</view>
												<view class="h5">{{item.address}}</view>
												<view class="h5">场所编码：{{item.placeCode}}</view>
												<view class="h5">
													{{item.placeStatus == 0 ? '已完成' : '未完成'}}排查<view style="display: inline-block;" v-if="item.placeStatus == 0">({{item.checkTime}})</view>
												</view>
												<view class="h5">{{item.industryCategory}}</view>
											</view>
											<view class="right" v-if="item.checkNum != 0">
												<view class="h6">评分：{{item.score}}</view>
											</view>
											<view class="bottom">
												<view class="one">隐患数：{{item.checkNum}}</view>
												<view class="online"></view>
												<view class="one">已整改：{{item.rectifyNum}}</view>
												<view class="online"></view>
												<view class="one">整改率：{{item.rectifyRate}}</view>
											</view>
										</view>
										<view class="loadingType">{{loadingType == true ?'没有更多数据了!' : '上拉显示更多'}}</view>
									</view>
								</view>
							</scroll-view>

						</view>
					</view>

				</view>
			</uni-popup>
		</scroll-view>

	</view>
</template>

<script>
	import searchinput from '../component/searchinput.vue'
	import analysisdrawer from '../component/analysisdrawer.vue'
	import server from '@/api/server.js'
	export default {

		name: 'workstatistics',
		props: {
			cur: String,
		},
		watch: {

		},
		data() {
			return {
				typelei: 6, //列表筛选
				typeleitwo: 6.1, //隐患列表筛选
				typeleiChansuo: 6.2, //场所列表筛选
				modalName: null,
				searchDesc: '',
				dangerDesc: '',
				formDataList: [],
				chansuoTotal: '',
				titleTime: '',
				dangerList: [],
				formData: {
					checkStartTime: '',
				},
				loadingType: false,
				onReachobj: {
					id: '',
					placeName: '',
					status: '',
					pageNo: 1,
					pageSize: 10,
				},

			}
		},
		mounted() {
			// this.$refs.mainindex.formData.dimension = 'criteria'
			this.titleTime = this.$refs.mainindex.formData.endTime
			this.$refs.mainindex.formSubmit()
		},
		methods: {
			// 跳转隐患详情
			gotoDanger(dangerId) {
				uni.navigateTo({
					// ? 后面加要传的参数， 多个参数用 & 隔开 
					url: '/pages/siteinvestigation/dangerdetail?id=' + dangerId
				})
			},
			// 跳转场所详情
			getdetail(placeId) {
				uni.navigateTo({
					// ? 后面加要传的参数， 多个参数用 & 隔开 
					url: '/pages/siteinvestigation/detail?id=' + placeId
				})
			},
			//图片预览
			photoPreview(data, index) {
				console.log(data)
				let photoList = data.map(item => {
					return item.url;
				});
				uni.previewImage({
					current: index,
					urls: photoList
				});
			},
			lowerBottom() {
				console.log(1111)
				this.scrolldanger();
			},
			lowerBottomTwo() {
				this.scrollchangsuo();
			},
			//隐患清单
			compCheck(id, status, type) {
				this.dangerList = []
				if (type == 'changsuo') {
					console.log(11111)
					let obj = {}
					obj.pageNo = 1
					obj.pageSize = 10
					obj.userId = id
					obj.type = status
					obj.community = ''
					obj.startTime = ''
					obj.endTime = ''
					obj.placeType = ''
					obj.placeName = ''
					// this.onReachobj.startTime = this.$refs.mainindex.formData.startTime,
					// this.onReachobj.endTime = this.$refs.mainindex.formData.endTime,
					// this.onReachobj.placeName = this.$refs.mainindex.formData.placeName,
					// this.onReachobj.placeType = this.$refs.mainindex.formData.placeType,
					// this.onReachobj.community = this.$refs.mainindex.formData.community,
					this.onReachobj = obj
					this.scrollchangsuo()
					this.$refs.changsuopopup.open('top')
				} else {
					console.log(22222)
					this.onReachobj.pageNo = 1
					this.onReachobj.pageSize = 10
					this.onReachobj.userId = id
					this.onReachobj.type = status
					this.scrolldanger()
					this.$refs.bottompopup.open('top')
				}



			},
			scrolldanger() {
				server.queryUserWorkByDanger(this.onReachobj).then(res => {
					console.log(res)
					if (res.data.result.records.length == 0) { //没有数据
						console.log('1111111111111111111111111111111111111')
						this.loadingType = true;
						return;
					}

					this.onReachobj.pageNo++; //每触底一次 page +1					
					this.dangerList = this.dangerList.concat(res.data.result.records); //将数据拼接在一起
				})
			},
			scrollchangsuo() {
				console.log(this.onReachobj)
				server.queryUserWorkByPlace(this.onReachobj).then(res => {
					console.log(res)
					this.chansuoTotal = res.data.result.total
					if (res.data.result.records.length == 0) { //没有数据
						console.log('1111111111111111111111111111111111111')
						this.loadingType = true;
						return;
					}

					this.onReachobj.pageNo++; //每触底一次 page +1					
					this.dangerList = this.dangerList.concat(res.data.result.records); //将数据拼接在一起

				})
			},
			//
			compclose() {
				this.$refs.bottompopup.close()
			},
			compcloseTwo() {
				this.$refs.changsuopopup.close()
			},
			//列表
			getlist(e) {
				this.onReachobj = e
				delete this.onReachobj.userName
				server.queryUserWork(e).then(res => {
					console.log(res)
					this.formDataList = res.data.result
					this.$refs.mainindex.closeDrawer()
				})
			},
			//隐患列表
			getlistTwo(e) {
				this.dangerList = []
				this.onReachobj.pageNo = 1
				server.queryUserWorkByDanger(e).then(res => {
					console.log(res)
					this.$refs.mainindextwo.closeDrawer()
					if (res.data.result.records.length == 0) { //没有数据
						this.loadingType = true;
						return;
					}

					this.dangerList = this.dangerList.concat(res.data.result.records); //将数据拼接在一起
				})
			},
			//场所列表
			getlistChansuo(e) {
				this.dangerList = []
				this.onReachobj.pageNo = 1
				let obj = {}
				obj.userId = this.onReachobj.userId
				obj.type = this.onReachobj.type
				let result = Object.assign(obj, e)
				server.queryUserWorkByPlace(result).then(res => {
					console.log(res)
					this.$refs.mainindexChansuo.closeDrawer()
					this.chansuoTotal = res.data.result.total
					if (res.data.result.records.length == 0) { //没有数据
						this.loadingType = true;
						return;
					}

					this.dangerList = this.dangerList.concat(res.data.result.records); //将数据拼接在一起

				})
			},
		},
		components: {
			searchinput,
			analysisdrawer
		}
	}
</script>

<style scoped lang="scss">
	.disflex {
		display: flex;
		justify-content: space-between;

		.span {
			width: 20%;
			display: flex;
			align-items: center;
			justify-content: center;
			background: white;
		}
	}

	// 时间
	.uni-btn-v {
		display: flex;
		margin-top: 20px;
		position: fixed;
		bottom: 0;
		width: 100%;

		uni-button {
			width: 100%;
			border-radius: 30px;
			margin: 10px;
		}

		uni-button:after {
			border: unset;
		}
	}

	.scrollHeight {
		height: 400px;
	}

	.disflexconent {
		display: flex;
		justify-content: space-between;
		padding: 15px 10px;
		background-color: white;
		font-size: 16px;

		.title {
			font-weight: bold;
		}

		// span {
		// 	width: 20%;
		// 	display: flex;
		// 	align-items: center;
		// 	justify-content: center;
		// 	background: white;
		// }
	}

	.labelnum {
		font-size: 18px;
	}

	// 时间
	.uni-btn-v {
		display: flex;
		margin-top: 20px;
		position: fixed;
		bottom: 0;
		width: 100%;

		uni-button {
			width: 100%;
			border-radius: 30px;
			margin: 10px;
		}

		uni-button:after {
			border: unset;
		}
	}

	.box .formbox .h4 {
		color: #007aff;
		font-size: 16px;
		display: flex;
		justify-content: space-between;
	}

	.shequcontent {
		background: #f1f1f1;

		.listdetail {
			display: inline-block;
			width: 100%;
			padding-top: 5px;

			.li {
				float: left;
				padding: 10px 5px;
				background: white;
				margin-bottom: 10px;
				border-radius: 10px;
				width: 100%;
				box-sizing: border-box;

				.planame {
					float: left;
					width: 100%;
				}

				.listtop {
					width: 100%;
					color: #969292;
					float: left;

					span:nth-child(1) {
						font-size: 18px;
						color: #007aff;
					}

					span:nth-child(2) {
						float: right;
					}
				}

				text {
					font-size: 15px;
				}

				.imglist {
					float: left;
					width: 100%;

					uni-image {
						float: left;
						width: 124px;
						height: 80px;
					}

				}

				.label {
					font-size: 15px;
					color: #999;
					float: left;
					width: 100%;
				}

				.listbottom {
					float: left;
					width: 100%;

					.jibie {
						float: right;
						margin-right: 10px;
					}

					.jibie,
					.zheng {
						border: 1px solid #525252;
						padding: 8px 15px;
						border-radius: 30px;
						color: #525252;
						font-size: 14px;
					}

					.zheng {
						float: right;
					}
				}
			}
		}
	}

	.box .formbox {
		padding: 10px;
		float: left;
		width: 100%;
		position: relative;
		background: #f1f1f1;
	}

	.uslist {
		.li {
			background: white;
			margin: 5px 0;
			position: relative;
		}

		.left {
			padding: 15px;

			.h6 {
				font-size: 16px;
				margin-bottom: 5px;
				font-weight: bold;
			}

			.h5 {
				line-height: 22px;
				font-size: 12px;
				color: #908c8c;
			}
		}

		.right {
			.h6 {
				position: absolute;
				top: 20px;
				right: 20px;
				border: 1px solid red;
				border-radius: 40px;
				padding: 2px 5px;
				font-size: 12px;
				color: red;
			}
		}

		.bottom {
			display: flex;
			justify-content: space-around;
			padding: 14px 10px;
			border-top: 1px solid #efefef;
			margin: 0 20px;

			.online {
				width: 1px;
				height: 19px;
				background: #efefef;
			}
		}
	}

	.totalspan {
		background: white;
		margin-bottom: 5px;
		font-size: 18px;
		padding: 0 10px 10px 10px;
	}
</style>
